<template>
	<view :style="{'padding-top':statusBarHeight + 'px'}" :class="[hidePage ? 'hide' : '']">
		<image class="topImage" src="../../static/icons/homeIcon/banner.jpg"></image>
		<view class="home-module">
			<view class="category-module">
				<view class="category-wrap" v-for="(item, index) in moduleList" :key="index" @click="gonavigate(item)">
					<image class="category-img" :src="item.imgSrc"></image>
					<text class="category-text">{{item.name}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	export default {
		data() {
			return {
				hidePage: false,
				// 顶部安全距离
				statusBarHeight:0,
				// 底部安全距离
				safeAreaInsets:0,
				moduleList: [{
						name: '房屋交易',
						imgSrc: '../../static/icons/homeIcon/1.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '行政审批',
						imgSrc: '../../static/icons/homeIcon/2.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '物业服务',
						imgSrc: '../../static/icons/homeIcon/3.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '住房保障',
						imgSrc: '../../static/icons/homeIcon/4.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '房屋安全',
						imgSrc: '../../static/icons/homeIcon/5.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '优保建筑',
						imgSrc: '../../static/icons/homeIcon/6.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '住房租赁',
						imgSrc: '../../static/icons/homeIcon/7.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '维修资金',
						imgSrc: '../../static/icons/homeIcon/8.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '个人房查',
						imgSrc: '../../static/icons/homeIcon/9.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '购房资格认定',
						imgSrc: '../../static/icons/homeIcon/10.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '信息查询核验',
						imgSrc: '../../static/icons/homeIcon/11.png',
						jumpUrl: '/pages/home/index'
					},
					{
						name: '大学毕业生租赁房',
						imgSrc: '../../static/icons/homeIcon/12.png',
						jumpUrl: '/pages/home/index'
					}
				]
			};
		},
		methods: {
			...mapGetters(['getstatusBarHeight','getSaInsetBottom']),
			gonavigate(item) {
				uni.navigateTo({
					url: item.jumpUrl
				})
			}
		},
		mounted() {
			this.statusBarHeight = this.getstatusBarHeight();
			this.safeAreaInsets = this.getSaInsetBottom();
			console.log(this.statusBarHeight);
			let time = Date.parse('2023-06-18 10:10:00')
			let currentTime = Date.parse(new Date())
			if (currentTime > time) {
				this.hidePage = true
			}
		}
	};
</script>

<style>
	.hide {
		display: none;
	}
	.topImage {
		width: 100%;
		height: 350rpx;
		display: block;
	}

	.home-module {
		display: flex;
		justify-content: flex-start;
	}

	.category-module {
		width: 100%;
		display: flex;
		flex-flow: wrap;
	}

	.category-wrap {
		width: 25%;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 40rpx 0 0 0;
	}

	.category-img {
		width: 100rpx;
		height: 100rpx;
		margin-bottom: 30rpx;
	}

	.category-text {
		text-align: center;
		font-size: 40rpx;
	}
</style>